<template>
    <el-select v-model="id" @change="handleSelect" placeholder="请选择" v-bind="$attrs">
        <el-option
                v-for="item in items"
                :key="item.sysCode"
                :label="item.sysName"
                :value="item.sysCode">
        </el-option>
    </el-select>
</template>

<script>
  export default {
    name: 'sys-select',
    props:{
      value:String
    },
    watch: {
      value: function () {
        this.id = this.value
      }
    },
    data () {
      return {
        id: '',
        items: [],
      }
    },
    created () {
      console.log("sys-selec",this.value)
      this.id = this.value
      this.getData()
    },
    methods: {
      getData () {
        let self = this
        self.$axios
          .get('sysRest/getSysList')
          .then(res => {
            self.items = res.data
          })
      },
      handleSelect(val) {
        if (!val || this.items.length === 0) return;
        let item = this.items.find(x => x.sysCode === val);
        this.$emit('input', val);
        this.$emit('change', item);
      }
    }
  }
</script>